<template>
  <div class="home">
    <div class="goods_topnav">
      <ul>
        <li @click="has(1)" :class="{goods_active:1==isshow}">出售中</li>
        <li @click="has(2)" :class="{goods_active:2==isshow}">仓库中</li>
      </ul>
    </div>

   
    <div class="box_msg">
      <div class="solid">
        <ul>
            <li :class="{list_active:9999==cateId}" @click="solid(9999)">全部商品</li>
          <li :class="{list_active:8888==cateId}" @click="solid(8888)">特价商品</li>
          <li
            v-for="item in cates"
            :key="item.id"
            :class="{list_active:item.id==cateId}"
            @click="solid(item.id)"
          >{{item.name}}</li>
        
         
        </ul>
      </div>
         
           <div class="left_box" v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="3">
              <div v-if="goodsList.length<1||goodsList==''" class="firstbox">
          <div>
            <img src="../../assets/images/暂无相关订单@2x.png" alt class="kong">
          </div>
          <div>暂时没有商品哦</div>
        </div> 
        <div class="firstbox" v-for="goods in goodsList" :key="goods.goodsId" v-else>
          <div class="box_sun">
            <img :src="goods.goodsThum" alt>
            <div class="box_for">
              <div >{{goods.goodsName}}</div>
              <span v-if="goods.discount==1" style="color:rgb(146, 146, 146); margin-right:5px; text-decoration:line-through">￥:{{goods.goodsRealPrice |amountMin100(2)}}</span>
              <span v-else></span>
              <span style="font-size:16px; ">￥:{{goods.goodsScreenPrice |amountMin100(2)}}</span>
            </div>
          </div>
          <div class="bombtn">
            <router-link :to="{name:'me_newgoods',query:{goodsid:goods.goodsId}}" @click.native="bjbaby()">编辑宝贝</router-link>
            <span class="borderbox"></span>
            <router-link to v-if="isshow==1" @click.native="xiajia(goods.goodsId)">下架</router-link>
             <router-link to v-else @click.native="shangjia(goods.goodsId)">上架</router-link>
                          <span class="borderbox"></span>
            <router-link to @click.native="delet(goods.goodsId)">删除</router-link>
                         <span class="borderbox"></span>
            <router-link to @click.native="tejia(goods.goodsId,goods.goodsScreenPrice,)">特价</router-link>
                         <span class="borderbox"></span>
            <router-link to @click.native="fxhas()">分享</router-link>
          </div>
        </div>

         
         <loadingtmp :busy="busy" :datalength="goodsList.length" :loadall="loadall" style="width:100%; margin-bottom:50px;" v-if="cateId==9999"></loadingtmp>
          <!-- <span v-else-if="(goodsList.length<1 && cates.length<1)"></span>  -->
      </div>


         <div class="Special_Settings" v-show="Special">
             <div class="Special_Settings_header">
                 <h1>设置产品特价</h1>
                 <div class="Theprice">
                    <span>原价</span>
                    <p>{{goodsScreenPrice |amountMin100(2)}}</p>
                 </div>
                 <div class="jiantou">
                     <img src="../../assets/personal/images/shihuangse.png">
                 </div>
                  <div class="Theprice">
                    <span style="color:red;">特价(元)</span>
                    <input type="number"  placeholder="请填写" v-model="hismoney">
                 </div>
                 <div class="clearfix"></div>
                 <div class="btn_tejia">
                     <button @click="moneyqx()">取消</button> <button @click="moneyqd()">确定</button>
                 </div>
             </div>
        </div>
    </div>
     
    <navfooter :pageName="pageName"></navfooter>
  </div>
</template>

<script>
import navfooter from "@/views/merchant/footer/me_footer";
 import loadingtmp from '@/components/load/loading'
export default {
  components: {
    navfooter,
    loadingtmp
  },
  data() {
    return {
      pageName: "me_goods",
      isshow: 1,
      cateId: 0,
      onLineCates: [],
      offLineCates: [],
      cates: [],
      goodsList: [],
      discount:1,
      Special:false,
      goodsScreenPrice:'',
      Specialoffer:'',
      hismoney:'',
      goodsid:'',
      xjcanshu:0,
      sjcanshu:1,
       busy: false,
      loadall: false,
      page:1
    };
  },
  //  activated(){
  //    console.log(this.$route.meta.isUseCache)
  //  },
  mounted() {
    this.getOnLineCates();
    this.cates = this.onLineCates;
    this.getOffLineCates();
  },
  methods: {
    loadMore(){
      this.busy=false
      this.loadall=false
      console.log('到底')
      //  this.busy = false;
      if(this.cateId==9999){
        console.log('全部')
       
           setTimeout(() => {
          this.cateGoods(this.page > 1);
      }, 500);

      }
   
    },
    has(i) {
      this.page=1
         if (this.isshow != i) {
        this.isshow = i;
        if (this.isshow == 1) {
          this.cates = this.onLineCates;
          // this.cateId =this.onLineCates[0].id;
          this.cateId=9999
          console.log('has')
        } else {
          this.cates = this.offLineCates;
          // this.cateId = this.offLineCates[0].id;
          this.cateId=9999
        }
        this.cateGoods();
      }
       
     
    },
    // 特价弹窗
    tejia(id,money){
      this.goodsScreenPrice=money
      this.goodsid=id 
       this.Special=true
    },   
    // 确定特价价格
    moneyqd(){
         console.log(this.hismoney,this.goodsid,this.goodsScreenPrice,this.discount)
         if(this.hismoney!=''){
           if(this.hismoney*100>this.goodsScreenPrice){
             layer.msg('特价价格不能超过原价')
           }else{
                   this.$http
            .put(this.APIURL_PREFIX + "/api/wap/goods", $.param({goodsScreenPrice:this.hismoney*100,goodsRealPrice:this.goodsScreenPrice,discount:1,goodsId:this.goodsid}))
            .then(response => {
              console.log(response)
                this.hismoney=''
              this.Special=false
              window.location.reload()
            })
           }

           
         }else{
           layer.msg('特价不能为空')
         }
    },
    // 取消设置特价
    moneyqx(){
      this.hismoney=''
    this.Special=false
    },
    fxhas(){
   layer.msg('暂未开通')
    },
    // 下架商品
    xiajia(id){
     console.log(id)
      this.$http
      .put(this.APIURL_PREFIX + "/api/wap/goods", $.param({goodsId:id,goodsOnline:this.xjcanshu}))
            .then(response => {
              console.log(response)
              layer.msg('下架成功')
              window.location.reload()
            })
    },
    // 上架商品
    shangjia(id){
      console.log(id)
       this.$http
      .put(this.APIURL_PREFIX + "/api/wap/goods", $.param({goodsId:id,goodsOnline:this.sjcanshu}))
            .then(response => {
              console.log(response)
              layer.msg('上架成功')
              window.location.reload()
            })
    },
    bjbaby(){
        sessionStorage.clear()
    },
    // 删除商品
    delet(id) {
      console.log(id);
      let vm = this;
     
      layer.confirm(
        "您确定删除该商品吗？",
        {
          btn: ["确定", "取消"] //按钮
        },
        function() {
          vm.$http
            .delete(vm.APIURL_PREFIX + "/api/wap/goods/" + id)
            .then(response => {
              console.log(response) 
              if (0 == response.data.code) {
                 window.location.reload()
                layer.msg("删除成功");
              }
              
            })
            .catch(function(err) {
              console.log(err);
            });
        }
      );
    },
    solid(id) {
      /*var target = event.target || window.event.srcElement,
      id = target.key;*/
      if (id != this.cateId) console.log(id);
      this.cateId = id;
      this.cateGoods();
    },
    getOnLineCates() {
      this.$http
        .get(this.APIURL_PREFIX + "/api/wap/companyOnlineCates")
        .then(res => {
          console.log(res);
          this.onLineCates = res.data.data;
          this.cates = this.onLineCates;
          // this.cateId = this.cates[0].id;
          this.cateId=9999
          this.cateGoods();
          // console.log(this.onLineCates);
        })
        .catch(err => {
          console.log(err);
        });
    },
    getOffLineCates() {
      this.$http
        .get(this.APIURL_PREFIX + "/api/wap/companyOfflineCates")
        .then(res => {
          console.log(res)
          this.offLineCates = res.data.data;
          console.log(this.offLineCates);
        })
        .catch(err => {
          console.log(err);
        });
    },
    
    cateGoods() {
     
      if(this.cateId==9999){
         
      }else{
        this.page=1
      this.goodsList=[]
      }
      if(this.cateId==9999){
        // this.cateId=''
        console.log(this.page)
        let rows=10
              let url =
        this.APIURL_PREFIX + "/api/wap/companyGods?page="+this.page+'&'+'rows='+rows;
      if (this.isshow == 1) url = url + "&goodsOnline=1";
      else url = url + "&goodsOnline=0";
      this.$http
        .get(url)
        .then(res => {
          console.log(res);
          if(res.data.data==''||res.data.data.length<1){
            this.busy=false
            this.loadall=true
            console.log('false')
          }
          if(res.data.data.length<10){
            this.busy=false
            this.loadall=true
          }
          //  this.goodsList = res.data.data;
          if(this.page==1){
            this.goodsList=res.data.data
            console.log('替换')
          }else{
            this.goodsList=this.goodsList.concat(res.data.data)
          }
           
           this.page++
          this.discount=res.data.data.discount
         
        })
        .catch(err => {
          console.log(err);
        });
      }else if(this.cateId==8888){
        // this.cateId=''
           let url =
        this.APIURL_PREFIX + "/api/wap/companyGods?page=1&discount="+1;
      if (this.isshow == 1) url = url + "&goodsOnline=1";
      else url = url + "&goodsOnline=0";
      this.$http
        .get(url)
        .then(res => {
          console.log(res);
          this.goodsList = res.data.data;
          console.log(this.goodsList);
          this.discount=res.data.data.discount
          console.log(this.discount)
        })
        .catch(err => {
          console.log(err);
        });
      }else{
           let url =
        this.APIURL_PREFIX + "/api/wap/companyGods?page=1&cateId=" + this.cateId;
      if (this.isshow == 1) url = url + "&goodsOnline=1";
      else url = url + "&goodsOnline=0";
      this.$http
        .get(url)
        .then(res => {
          console.log(res);
          this.goodsList = res.data.data;
          console.log(this.goodsList);
          this.discount=res.data.data.discount
          console.log(this.discount)
        })
        .catch(err => {
          console.log(err);
        });
      }
    
    }
  }
};
</script>

<style scoped>
@import "../../assets/personal/css/me_goods.css";
</style>
